<template>
    <div>
    <div class="outmain ba_f formwidth">
        <div class="shuju_title mar_b20">
            <div class="shuju_title_text">
                <span>百度小程序页面路径</span>
            </div>
        </div>
       <div>
           <el-table
                   v-loading="listLoading"
                   :element-loading-text="elementLoadingText"
                   :data="list"
                   class="mar_t20"
                   style="width: 100%">
               <el-table-column
                       prop="name"
                       label="名称"
               >
               </el-table-column>
               <el-table-column
                       prop="page"
                       label="链接"
               >
               </el-table-column>
               <el-table-column
                       prop="address"
                       label="操作"
                       width="180">
                   <template slot-scope="scope">
                       <el-button
                               size="mini"
                               @click="copyText(scope.row)">复制链接
                       </el-button>
                   </template>
               </el-table-column>
           </el-table>
       </div>
    </div>
<!--        <div class="mar_t20 ba_f pad_20 t_c">-->
<!--            <el-button type="primary" @click="onSubmit()">保存</el-button>-->
<!--        </div>-->
    </div>
</template>
<script>
    import {getConfig, postConfig,getPage} from "@/api/setup";
    export default {
        created() {
            this.bus.$emit('loading', true);
            this.init();
        },
        data() {
            return {
                activeName:'1',
                form: {
                    name: '',
                    appId: '',
                    appSecret: '',
                    originalAppId: '',
                },
                form2: {
                    name: '',
                },
                rules: {
                    name: [
                        {required: true, message: '请输入公众号名称', trigger: 'blur'},
                    ],
                    originalAppId: [
                        {required: true, message: '请输入originalAppId', trigger: 'blur'},
                    ],
                    appId: [
                        {required: true, message: '请输入AppId', trigger: 'blur'}
                    ],
                    appSecret: [
                        {required: true, message: '请输入appSecret', trigger: 'blur'}
                    ]
                },
                list: [],
                listLoading: true,
                selectRows: "",
                elementLoadingText: "正在加载...",
            }
        },
        methods: {
            async init() {
                this.fetchData()
            },
            async fetchData() {
                this.listLoading = true;
                const { data } = await getPage({page: 'weChatPage'});
                this.list = data;
                this.bus.$emit('loading', false)
                setTimeout(() => {
                    this.listLoading = false;
                }, 100);
            },
            handleCurrentChange(val) {
                this.page.currentPage = val;
                this.fetchData();
            },
            copyText(row){
                let Url2 = row.page;  //每一行的某个值，如选中的当前行的url
                var oInput = document.createElement('input');     //创建一个隐藏input（重要！）
                oInput.value = Url2;    //赋值
                console.log(oInput.value);
                document.body.appendChild(oInput);
                oInput.select(); // 选择对象
                document.execCommand("Copy"); // 执行浏览器复制命令
                oInput.className = 'oInput';
                oInput.style.display='none';
                this.$message({
                    message: '复制成功',
                    type: 'success'
                });
            },
            async onSubmit() {

            }
        }
    }
</script>
